<template>
  <div style="position:fixed; width: 100%;z-index: 9999;">
    <nav class="navbar navbar-default">
      <div class="container-fluid" style="max-width: 1200px;margin: 0 auto;">
        <div class="navbar-header">
          <button
            type="button"
            class="navbar-toggle collapsed"
            data-toggle="collapse"
            data-target="#bs-example-navbar-collapse-1"
            aria-expanded="false"
          >
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <div class="nav_login">
            <img class="navbar-brand" src="http://cdn.dbsgw.cn/logo.png" alt="">
          </div>
        </div>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <!--          导航菜单-->
          <ul class="nav navbar-nav">
            <li v-for="(item,i) in HeaderList" :key="item.Link">
              <nuxt-link  :to="item.Link">{{ item.Title }}</nuxt-link>
            </li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
            <li class="visible-md visible-lg">
              <form class="navbar-form navbar-left">
                <div class="form-group">
                  <input type="text" class="form-control" placeholder="请输入关键词">
                </div>
                <button type="submit" class="btn btn-default">搜索</button>
              </form>
            </li>
          </ul>
        </div>
        <!-- /.navbar-collapse -->
      </div>
      <!-- /.container-fluid -->
    </nav>
  </div>
</template>
<script>
export default {
  data() {
    return {
      HeaderList: [],
      activeindex: 1
    };
  },
  created() {
    this.$axios
      .$get("/v1/nav/")
      .then(con => {
        this.HeaderList = con.data
        // this.page.total = con.total;
      });

  },
  methods:{
    active(con){
      console.log(con)
      this.activeindex = con
    }
  }

};
</script>
<style lang="scss" scoped>
.nav_login {
  width: 190px;
  height: 50px;
}

ul > li > .actives {
  color: orangered;
}

.navbar-brand {
  padding: 0;
}

.navbar-default {
  background-color: #fff;
  color: #333333;
}
</style>

